<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!doctype html>
<html lang="en">

	<head>
		<!-- Required meta tags -->
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

		<title>Services</title>
		<!-- web fonts -->
		<link href="http://fonts.googleapis.com/css?family=Nunito:400,600,700,800,900&display=swap" rel="stylesheet">
		<link href="http://fonts.googleapis.com/css?family=Hind&display=swap" rel="stylesheet">
		<!-- //web fonts -->
		<!-- Template CSS -->
		<link rel="stylesheet" href="${pageContext.request.contextPath }/dist/assets/css/style-starter.css">
		
		

	</head>

	<body>

		<section class="w3l-bootstrap-header">
			<nav class="navbar navbar-expand-lg navbar-light py-lg-3 py-2">
				<div class="container">
					<a class="navbar-brand" > 请假审批</a>
					<!-- if logo is image enable this   
    <a class="navbar-brand" href="#index.html">
        <img src="image-path" alt="Your logo" title="Your logo" style="height:35px;" />
    </a> -->
					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon fa fa-bars"></span>
      </button>

					<div class="collapse navbar-collapse" id="navbarSupportedContent">
						<ul class="navbar-nav ml-auto">
							<li class="nav-item">
								<a class="nav-link" href="${pageContext.request.contextPath }/front/mysef.jsp">主界面</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" href="${pageContext.request.contextPath }/front/services.jsp">查看请假条</a>
							</li>
							<li class="nav-item">
           					 <a class="nav-link" href="${pageContext.request.contextPath }/front/leave.jsp">请假申请</a>
         					 </li>
          
        
         					 <li class="nav-item">
           						 <a class="nav-link" href="${pageContext.request.contextPath }/front/puchclock.jsp">每日打卡</a>
         					 </li>
						</ul>

					</div>
				</div>
			</nav>
		</section>
		<section class="w3l-service-breadcrum">
			<div class="breadcrum-bg">
				<div class="container py-5">
				</div>
			</div>
		</section>
		<!--<div id="beijing">
			<img src="dist/assets/images/fangzi.jpg" />
		</div>
		-->
		<section class="w3l-features-4" id="zhuyuanbaoxiao">
			
			<!-- /features -->
			<div class="features py-5" id="services">
				<div class="container py-md-3">
					<div class="heading text-center mx-auto">
						<h3 class="head">住院报销</h3>
						<p class="my-3 head">一、如果参加社会保险了，职工报销医药费可以到社保中心报销。 （1）单位支付的住bai院费用。借：其他应收款--XXX住院费用贷：银行存款等 （2）出院后，到社保中心办理报销手续。借：银行存款（社保报销部分）借：管理费用--福利费（不能报销部分）贷：其他应收款--XXX住院费用
						二、如果没有参加社会保险，发生的住院费用借：管理费用--福利费（或应付职工薪酬--职工福利）贷：库存现金
						</p>
						<p class="my-3 head">《社会保险费征缴暂行条例》第3条第5款规定：“社会保险费的费基、费率依照有关法律、行政法规和国务院的规定执行。”
						 目前，对于社会保险的缴费基数和费率的规定，体现在《职工基本养老保险个人账户管理暂行办法》、《关于建立城镇职工基本医疗保险制度的决定》、《失业保险条例》，虽然基本养老保险费、基本医疗保险费、失业保险费的缴费费率各不相同。
						 但缴费基数均统一为职工工资总额。国家统计局《关于工资总额组成的规定》第4条指出：“工资总额由下列六个部分组成：计时工资；计件工资；奖金；津贴和补贴；加班加点工资；特殊情况下支付的工资”。
						（一）制度健全。企业应当依法制订职工福利费的管理制度，并经股东会或董事会批准，明确职工福利费开支的项目、标准、审批程序、审计监督。（二）标准合理。国家对企业职工福利费支出有明确规定的，企业应当严格执行。国家没有明确规定的，企业应当参照当地物价水平、职工收入情况、企业财务状况等要求，按照职工福利项目制订合理标准。（三）管理科学。企业应当统筹规划职工福利费开支，实行预算控制和管理。职工福利费预算应当经过职工代表大会审议后，纳入企业财务预算，按规定批准执行，并在企业内部向职工公开相关信息。（四）核算规范。企业发生的职工福利费，应当按规定进行明细核算，准确反映开支项目和金额。</p>
						

						<form>
							<table class="table table-bordered">
								<thead>
									<tr  class="table-primary">
										<th>员工姓名</th>
										<th>请假原因</th>
										<th>起始时间</th>
										<th>结束时间</th>
										<th>审批结果</th>	
									</tr>
								</thead>
								
								<tbody id="leaveListBody">
								
								</tbody>
							</table>
							<button type="button" class="btn btn-primary" id="flash">结果刷新</button>

						</form>
					</div>

				</div>

			</div>
			</div>
			<!-- //features -->
		</section>
		

		</section>

		<!-- grids block 5 -->
		<section class="w3l-footer-29-main" id="footer">
			<div class="footer-29 text-center">
				<div class="container">

					<div class="main-social-footer-29">

						<a href="#facebook" class="facebook"><span class="fa fa-facebook"></span></a>
						<a href="#twitter" class="twitter"><span class="fa fa-twitter"></span></a>
						<a href="#instagram" class="instagram"><span class="fa fa-instagram"></span></a>
						<a href="#google-plus" class="google-plus"><span class="fa fa-google-plus"></span></a>
						<a href="#linkedin" class="linkedin"><span class="fa fa-linkedin"></span></a>
					</div>
					<div class="bottom-copies text-center">
						<p class="copy-footer-29">Copyright &copy; 2020.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>

					</div>
				</div>
			</div>
			<!-- move top -->
			<button onclick="topFunction()" id="movetop" title="Go to top">
              <span class="fa fa-angle-up"></span>
                 </button>
			<script>
				// When the user scrolls down 20px from the top of the document, show the button
				window.onscroll = function() {
					scrollFunction()
				};

				function scrollFunction() {
					if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
						document.getElementById("movetop").style.display = "block";
					} else {
						document.getElementById("movetop").style.display = "none";
					}
				}

				// When the user clicks on the button, scroll to the top of the document
				function topFunction() {
					document.body.scrollTop = 0;
					document.documentElement.scrollTop = 0;
				}
			</script>
			<!-- /move top -->
		</section>
		<!-- // grids block 5 -->
		<script src="${pageContext.request.contextPath }/dist/js/jquery-3.3.1.min.js"></script>
		<!-- //footer-28 block -->
		</section>

		<script>
			$(function() {
				$('.navbar-toggler').click(function() {
					$('body').toggleClass('noscroll');
				})
			});
		</script>
		<style type="text/css">
			/*#beijing{
				
				z-index:-1;
				
			}
			
			#services{
				
				*/
			}
		</style>
		<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<%-- 		<script src="${pageContext.request.contextPath }/dist/assets/js/jquery-3.4.1.slim.min.js"></script> --%>

		<script src="${pageContext.request.contextPath }/dist/assets/js/bootstrap.min.js"></script>
	</body>
	<script type="text/javascript">
		$(function(){
			//刷新按钮点击事件
			$("#flash").click(function(){
				$.post("${pageContext.request.contextPath}/LeaveController",{op:"queryMyLeave"},function(leaveList){
					showLeaveData(leaveList);
				},"json")
			})
			
			$.post("${pageContext.request.contextPath}/LeaveController",{op:"queryMyLeave"},function(leaveList){
				showLeaveData(leaveList);
			},"json")
		})
		
		function showLeaveData(data){
		$("#leaveListBody").empty();
		$.each(data,function(i,leave){
			 $("#leaveListBody").append("<tr>"+
		  	         "<td>"+leave.approvalId+"</td>"+
			         "<td>"+leave.leaveReasons+"</td>"+
			         "<td>"+leave.leaveTime.substring(0,leave.leaveTime.length-2)+"</td>"+
			         "<td>"+leave.backTime.substring(0,leave.backTime.length-2)+"</td>"+
			         "<td>"+(leave.result == 0 ? "待审批" : leave.result == 1 ? "已批准" : "拒批")+"</td>"+
			       "</tr>") 
		})
	}
	</script>

</html>
<!-- // grids block 5 -->